<template>
	<view class="app">
		<cu-custom bgColor="bg-white" :isBack="true">
			<block slot="backText">返回</block>
			<block slot="content">客户审批</block>
		</cu-custom>
		<view>
			<uni-list>
				<uni-list-item note="客户名称" :title="customer.name"></uni-list-item>
				<uni-list-item note="客户组织" :title="customer.organizationName"></uni-list-item>
				<uni-list-item note="客户分类" :title="customer.customerTypeName"></uni-list-item>
				<uni-list-item note="客户类别" :title="customer.customerTypeChildName"></uni-list-item>
				<uni-list-item note="业务员" :title="customer.bizName"></uni-list-item>
				<uni-list-item note="负责人" :title="customer.principal"></uni-list-item>
				<uni-list-item note="联系电话" :title="customer.phoneNumber"></uni-list-item>
				<uni-list-item>
					<view slot="body" v-if="customer.approved">
						<view class="uni-input">{{customer.priceStrategyName}}</view>
					</view>
					<view slot="body" v-else class="uni-list-cell-right">
						<picker :range="priceStrategyLists" :range-key="'strategyName'" @change="bindPriceStrategyPickerChange">
							<view class="uni-input">{{customer.priceStrategyName}}</view>
						</picker>
					</view>
					<view slot="footer" class="footer" >价格策略</view>
				</uni-list-item>
				<uni-list-item>
					<view slot="body" v-if="customer.approved">
						<view class="uni-input">{{selectWuliu}}</view>
					</view>
					<view slot="body" v-else  class="slot-box uni-list-cell-right">
						<picker :range="wuliuLists" :range-key="'fdataValue'" @change="bindWuliuPickerChange">
							<view class="uni-input">{{selectWuliu}}</view>
						</picker>
					</view>
					<view slot="footer" class="footer" >物流线路</view>
				</uni-list-item>
				
				<uni-list-item>
					<view slot="body" v-if="customer.approved">
						<view class="uni-input">{{selectOrderQty}}</view>
					</view>
					<view slot="body" v-else class="uni-list-cell-right">
						<picker :range="orderQtyList" :range-key="'orderQty'" @change="bindOrderQtyPickerChange">
							<view class="uni-input">{{selectOrderQty}}</view>
						</picker>
					</view>
					<view slot="footer" class="footer" >起订量</view>
				</uni-list-item>
				<uni-list-item note="运费">
					<view slot="body" v-if="customer.approved">
						<view class="uni-input">{{customer.freightFee}}</view>
					</view>
					<view slot="body" v-else>
						<uni-easyinput type="number" v-model="customer.freightFee" placeholder="请输入运费" autocomplete="off" />
					</view>
					<view slot="footer" class="footer">运费</view>
				</uni-list-item>
				<uni-list-item note="详细地址" :title="customer.address"></uni-list-item>
				<uni-list-item direction="column" v-if="!customer.approved" style="padding-bottom: 60rpx;">
					<template v-slot:header>
						<view class="uni-approved"><button @click="approved">审批通过</button></view>
					</template>
					<template v-slot:body>
						<view class="uni-delete"><button @click="deleted">删除用户</button></view>
					</template>
				</uni-list-item>
			</uni-list>
		</view>
	</view>
</template>

<script>
	import {
		getPromoteNumApi,
		getCustomerInfoApi,
		getAllApprovedPriceStrategyApi,
		getPriceStrategyInfoApi,
		approvedCustomerApi,
		deleteCustomerApi,
		getWuliuList
	} from "@/server/config.js";
	import {
		toLogin
	} from "@/server/api.js";
	import province from '@/static/mockjs/region';
	export default {
		data() {
			return {
				customer: {},
				priceStrategyLists:[],
				wuliuLists:[{'fdataValue':'请选择路线','fnumber':'',}],
				selectOrderQty:'请选择',
				selectWuliu:'请选择',
				orderQtyList:['请选择','100','200','300','400','500','600','700','800'],
			};
		},
		// uni.navigateTo 目标页面 pages/test.vue
		onLoad: function(option) {
			const eventChannel = this.getOpenerEventChannel()
			//this.priceStrategyLists
			let _this = this;
			
			if(eventChannel.id){
				eventChannel.on('acceptDataFromOpenerPage', async function(data) {
					
					//初始化会员
					_this.initCustomer(data.data)
				})
			}else{
				//根据URL获取会员信息
			}
			
		},
		onShow() {
			toLogin();
		},
		onReachBottom() {

		},
		methods: {
			
			async fetchCustomerInfo(id){
				
			},
			
			async initCustomer(customer){
				let _this = this;
				
				let res = await getAllApprovedPriceStrategyApi({
					approved:true
				})
				_this.priceStrategyLists = res.data
				//_this.$set(_this.customer,'name','1233')
				_this.customer = customer;
				
				let priceStrategyName = ''
				
				if(_this.customer.priceStrategy){
					let res = await getPriceStrategyInfoApi(_this.customer.priceStrategy)
					//_this.customer.priceStrategyName = res.data.strategyName
					priceStrategyName = res.data.strategyName
				}
				
				_this.$set(_this.customer, 'priceStrategyName', priceStrategyName)
				
				//物流路线
				let wuliuRes = await getWuliuList()
				
				_this.wuliuLists = _this.wuliuLists.concat(wuliuRes.data) 
				
				
				//设置省市区
				let selectProvince =
					province.find((o) => o.id == _this.customer.province) || {}
				
				//市
				let selectCity = null;
				if (selectProvince) {
					let cityList = selectProvince.children
					selectCity = cityList.find((o) => o.id == _this.customer.city)
				}
				
				let selectArea = null;
				//区
				if (selectCity) {
					let areaList = selectCity.children
					selectArea = areaList.find((o) => o.id == _this.customer.district)
				}
				
				_this.$set(_this.customer,'address','')
				if(selectProvince && selectCity && selectArea){
					_this.$set(_this.customer, 'address', selectProvince.value + selectCity.value + selectArea.value + (_this.customer.address || ''))
				}
				
				//物流路线
				_this.selectWuliu = _this.customer.wuliuCode ? _this.customer.wuliuName : '请选择'
				//起订量
				_this.selectOrderQty = _this.customer.orderQty ? _this.customer.orderQty : '请选择'
			},
			//审批用户
			approved() {
				
				let _this = this;
				
				if(this.customer.orderQty > 0 ){
					if(!this.customer.freightFee){
						uni.showToast({
							title: "请设置运费", //提示的内容,
							duration: 1000, //延迟时间,
							icon: "none",
							mask: true, //显示透明蒙层，防止触摸穿透,
							success: res => {}
						});
						return
					}
				}
				
				uni.showModal({
					title: "审批用户",
					content: "确定要审批通过此用户吗？",
					success: async res => {
						if (res.confirm) {
							_this.customer.approved = true
							await approvedCustomerApi(_this.customer)
							const eventChannel = _this.getOpenerEventChannel()
							eventChannel.emit('acceptDataFromOpenedPage', {data: _this.customer});
							
							uni.navigateBack();
							
						} else if (res.cancel) {}
					}
				});
			},
			//删除用户
			deleted() {
				let _this = this;
				uni.showModal({
					title: "删除用户",
					content: "确定要删除此用户吗？",
					success: async res => {
						if (res.confirm) {
							await deleteCustomerApi(_this.customer.id)
							_this.customer.deleted = true
							const eventChannel = _this.getOpenerEventChannel()
							eventChannel.emit('acceptDataFromOpenedPage', {data: _this.customer});
							uni.navigateBack();
						} else if (res.cancel) {}
					}
				});
			},
			bindPriceStrategyPickerChange(e){
				let index = e.target.value
				this.customer.priceStrategy = this.priceStrategyLists[index].id
				this.customer.priceStrategyName = this.priceStrategyLists[index].strategyName
			},
			bindWuliuPickerChange(e){
				let index = e.target.value
				this.customer.wuliuCode = index == 0 ? '' : this.wuliuLists[index].fnumber
				this.customer.wuliuName = this.wuliuLists[index].fdataValue
				this.selectWuliu = this.customer.wuliuName
			},
			bindOrderQtyPickerChange(e){
				let index = e.target.value
				this.customer.orderQty = index == 0 ? 0: parseInt(this.orderQtyList[index],10)
				this.selectOrderQty = this.orderQtyList[index]
				console.info(this.customer)
			}
		}
	}
</script>
<style lang='scss' scoped>
	@import "./style";
</style>
